﻿@namespace MudBlazor.Docs.Examples

<MudPaper Width="250px" Class="d-inline-flex py-3" Square="true">
    <MudNavMenu Class="mud-width-full">
        <MudText Typo="Typo.h6" Class="px-4">Material</MudText>
        <MudText Typo="Typo.body2" Class="px-4 mud-text-secondary">Icons</MudText>
        <MudDivider Class="my-2" />
        <MudNavLink Href="/dashboard" Icon="@Icons.Filled.Dashboard">Dashboard</MudNavLink>
        <MudNavLink Href="/servers" Icon="@Icons.Filled.Storage">Servers</MudNavLink>
        <MudNavLink Href="/billing" Icon="@Icons.Filled.Receipt" Disabled="true">Billing</MudNavLink>
        <MudNavGroup Title="Settings" Icon="@Icons.Filled.Settings" Expanded="true">
            <MudNavLink Href="/users" Icon="@Icons.Filled.People" IconColor="Color.Success">Users</MudNavLink>
            <MudNavLink Href="/security" Icon="@Icons.Filled.Security" IconColor="Color.Info">Security</MudNavLink>
        </MudNavGroup>
    </MudNavMenu>
</MudPaper>
<MudPaper Width="250px" Class="d-inline-flex py-3" Square="true">
    <MudNavMenu Class="mud-width-full">
        <MudText Typo="Typo.h6" Class="px-4">Font Awesome</MudText>
        <MudText Typo="Typo.body2" Class="px-4 mud-text-secondary">Icons</MudText>
        <MudDivider Class="my-2" />
        <MudNavLink Href="/dashboard" Icon="fas fa-chart-line">Dashboard</MudNavLink>
        <MudNavLink Href="/servers" Icon="fas fa-server">Servers</MudNavLink>
        <MudNavLink Href="/billing" Icon="fas fa-receipt" Disabled="true">Billing</MudNavLink>
        <MudNavGroup Title="Settings" Icon="fas fa-cogs" Expanded="true">
            <MudNavLink Href="/users" Icon="fas fa-users" IconColor="Color.Success">Users</MudNavLink>
            <MudNavLink Href="/security" Icon="fas fa-user-shield" IconColor="Color.Info">Security</MudNavLink>
        </MudNavGroup>
    </MudNavMenu>
</MudPaper>
